tags: JavaScript

「如果肚子餓了，就吃香蕉」--流程判斷邏輯

最簡單的流程控制，就是「如果」符合某個條件，就去做某件事，也就是if...else這樣的程式語法。

就像「如果肚子餓了，就吃香蕉」，猴子嗎？

例如：「打不過，逃！」這是江南七怪的老五南樵子在學生郭靖要出江湖闖蕩時，提醒郭靖的話。如果滿足「打不過」這個條件，就做「逃」這個動作。

if (條件式){
	//條件成立(true)的話，執行{ }區塊內的內容
}
else {
	//如果條件不成立(false)，執行{ }區塊中的內容
}

如果條件不只一個，可以使用 else...if 來新增條件。

if (條件式 1){
	//條件1成立(true)的話，執行{ }區塊內的內容
}
else if (條件式 2){
	//條件2成立(true)的話，執行{ }區塊內的內容
}
else if (條件式 3){
	//條件3成立(true)的話，執行{ }區塊內的內容
}
else {
	//如果上面的條件都不成立(false)，執行{ }區塊中的內容
}

回到郭靖的例子：

var fight = '打到對方吐血';
if ('打不過' === true) {
	fight = '逃';
}

我想隨機選出1到7之間的數字，用來表示江南七怪的排行，例如數字等於1就印出「飛天蝙蝠--柯鎮惡」，數字等於2就印出「妙手書生--朱聰」，依此類推。

Math.random() 會隨機產生 0 到 1 之間的小數。 而 Math.ceil(x) 會將x無條件進位。

//Math.random() 會隨機產生 0 到 1 之間的小數。 而 Math.ceil(x) 會將x無條件進位。

if(Math.ceil(Math.random()*7)===1){
  console.log('飛天蝙蝠--柯鎮惡');
}
else if (Math.ceil(Math.random()*7)===2){
  console.log('妙手書生--朱聰');
}
else if (Math.ceil(Math.random()*7)===3){
  console.log('馬王神--韓寶駒');
}
else if (Math.ceil(Math.random()*7)===4){
  console.log('南山樵子--南希仁');
}
else if (Math.ceil(Math.random()*7)===5){
  console.log('笑彌陀--張阿生');
}
else if (Math.ceil(Math.random()*7)===6){
  console.log('鬧市俠隱--全金發');
}
else{
  console.log('越女劍--韓小瑩');
}

寫了這麼落落長的一段，看得眼都花了，if .... else ....也判斷了7次，就效能上來說比較差。

JavaScript還有另一種的switch條件判斷式，適合這樣的情況。

switch(Math.ceil(Math.random()*7)){
  case 1:
    console.log('飛天蝙蝠--柯鎮惡');
    break;
  case 2:
    console.log('妙手書生--朱聰');
    break;
  case 3:
    console.log('馬王神--韓寶駒');
    break;
  case 4:
    console.log('南山樵子--南希仁');
    break;
  case 5:
    console.log('笑彌陀--張阿生');
    break;
  case 6:
    console.log('鬧市俠隱--全金發');
    break;
  case 7:
    console.log('越女劍--韓小瑩');;
    break;
  default:
    console.log('六怪陣亡，只剩老大飛天蝙蝠柯鎮惡');
    break;
}

switch括號中可以放入「運算式」、「變數」或「值」，如果符合case後面所列出來的條件，就執行那個case區塊的程式敘述。如果都不符合則執行default區塊的程式敘述。

當滿足case列出來的條件，執行完程式敘述，break指令會中指流程判斷，不去執行後面的case條件判斷。